<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <button>传统注册事件</button>
    <button>方法监听传统注册事件</button>
    <button>ie9 attch</button>

    <script>
      var btns = document.querySelectorAll('button');
      //1. 传统方式注册事件   只能有1个同类事件   设置多个会被覆盖掉
      btns[0].onclick = function () {
        console.log('有情人终成眷属');
      };
      btns[0].onclick = function () {
        console.log('没钱人亲眼目睹');
      };
      // 2.高级绑定  给元素增加事件监听  H5新增  兼容性IE9+
      //
      btns[1].addEventListener('click', function () {
        console.log('有钱人终成眷属');
      });
      btns[1].addEventListener('click', function () {
        console.log('没钱人亲眼目睹');
      });
    </script>
  </body>
</html>
